Vue.component('todo-header', {
    template: `

    <header class="header">
        <h1>todos</h1>
        <input class="new-todo" placeholder="What needs to be done?" autofocus @keyup.enter="headerEnterUp" v-model.trim="userInput">
    </header>

    `,
    data() {
        return {
            msg: '测试信息',
            // userInput属性获取用户输入，子传父处理
            userInput: ''
        }
    },
    methods: {
        headerEnterUp() {
            console.log(this.userInput);
            // 将用户输入构建成一个对象传给父
            this.$emit('p-add-list', this.userInput);

            this.userInput = '';
        }
    }
});